<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.css" >
    <link rel="stylesheet" href="../statics/css/style.css">
</head>
<body>

    <div class="ui container">
        <div class="ui top aligned teal segment">
            <p class="ui middle aligned attached">CRUD-INPUT</p>
        </div>
        <form class="ui form" action="#" th:object="${user}" th:action="${user.user_id}==null ?  @{/insertUser} : @{/update/{id}(id=${user.user_id})}"  method="post">
            <div class="field">
                <label>用户状态</label>
                <div class="ui selection dropdown" style="width: 80px">
                    <input type="hidden" name="user_status" th:value="${user.user_status}">
                    <i class="dropdown icon"></i>
                    <div class="default text">用户状态</div>
                    <div class="menu">
                        <div class="item" data-value="通过">通过</div>
                        <div class="item" data-value="待审核">待审核</div>
                        <div class="item" data-value="禁用">禁用</div>
                    </div>
                </div>
            </div>
            <div class="field">
                <label>用户角色</label>
                <input type="text" name="user_role" th:value="${user.user_role}" placeholder="用户角色">
            </div>
            <div class="field">
                <label>用户介绍</label>
                <input type="text" name="user_introduce" th:value="${user.user_introduce}" placeholder="用户介绍">
            </div>
            <div class="field">
                <label>用户邮箱</label>
                <input type="text" name="user_email" th:value="${user.user_email}" placeholder="用户邮箱">
            </div>
            <div class="field">
                <label>用户手机号</label>
                <input type="text" name="user_phone" th:value="${user.user_phone}" placeholder="用户手机号">
            </div>
            <div class="field">
                <label>用户认证途径</label>
                <div class="ui selection dropdown" style="width: 80px">
                    <input type="hidden" name="identify_way" th:value="${user.identify_way}">
                    <i class="dropdown icon"></i>
                    <div class="default text">认证方式</div>
                    <div class="menu">
                        <div class="item" data-value="学号认证">学号认证</div>
                        <div class="item" data-value="身份证验证">身份证验证</div>
                    </div>
                </div>
            </div>
            <div class="field">
                <label>用户认证编号</label>
                <input type="text" name="identify_num" th:value="${user.identify_num}" placeholder="用户认证编号">
            </div>
            <div class="field">
                <label>用户姓名</label>
                <input type="text" name="user_real_name" th:value="${user.user_real_name}" placeholder="用户姓名">
            </div>
            <div class="field">
                <label>用户头像</label>
                <img src="https://unsplash.it/150/150?image=1005" th:src="@{${user.user_avator}}"  alt="" class="ui image">
            </div>

            <div class="field">
                <label>用户学校</label>
                <input type="text" name="user_school" th:value="${user.user_school}" placeholder="用户学校">
            </div>
            <div class="field">
                <label>用户院系</label>
                <input type="text" name="user_department" th:value="${user.user_department}" placeholder="用户院系">
            </div>
            <!--        <div class="ui negative message" th:if="${#fields.hasErrors('name')}"  >  //检测属性是否为空，空的话返回备注name的错误信息，前端利用下方的script返回原定的错误信息，后端返回实体类上标注的错误信息-->
            <!--            <i class="close icon"></i>-->
            <!--            <div class="header">验证失败</div>-->
            <!--            <p th:errors="*{name}">提交信息不符合规则</p>-->
            <!--        </div>-->
            <button class="ui teal button" type="submit">完成</button>
            <div class="ui error message"></div>
        </form>
    </div>




<script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.js"></script>
<script>

    $('.dropdown')
        .dropdown({
            clearable: true
        })
    ;
</script>
</body>
</html>